<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
    <script src="https://css2020.yixuan.net/2020css/yx2020/js/jquery.js?v=2"></script>
    <link rel="stylesheet" type="text/css" href="{$_G['URL']['EDUCATION_STATIC_PATH']}/css/reset.css?v=3">
    <script src="{$_G['URL']['LOTTERY_CSS']}lottery/js/layer/layer.js"></script>
    <script src="{$_G['URL']['YX2020_CSS']}js/md5.js?v=2"></script>
    <link rel="stylesheet" type="text/css" href="{$_G['URL']['EDUCATION_STATIC_PATH']}/css/style.css?v=10">
    {if $config['weixinh5']==2}
    <script src="{$_G['URL']['YX2020_CSS']}js/vconsole.min.js"></script>
    <script> var vConsole = new VConsole(); </script>
    {/if}
    <script type="text/javascript" src="{$_G['URL']['PUBLIC_JS']}yx2020/ping.js?v=15"></script>
    <script type="text/javascript" src="{$_G['URL']['PUBLIC_JS']}yx2020/duihua.js?v=18"></script>


    <script>
        init();
        window.onresize = init;
        function init(){
            document.documentElement.style.fontSize =
                document.documentElement.clientWidth / 7.5 + 'px';
        }
    </script>
    <title>{$theme['title']}</title>
    <style>
        .schoolAlt{
            max-height: 10rem;
        }
    </style>
</head>
<body>
<!--商家列表-->
<div class="serviceList">
    <ul id="serviceList_ul">
        {loop $sj_detail_list $index $item}
        <li style="background: {$edu_colors['shop_item_c']}" data-k="{php echo $index;}" data-sjid="{$item['sj_id']}">
            <div class="serviceImg">
                <img src="{$item['logo']}" >
            </div>
            <div class="serviceTxt">
                <h2>{$item['name']}</h2>
                <p class="phoneNum">{$item['kefu']['mobile']}</p>
                <p class="addInfor">{$item['address'][0]}</p>
                {if $show_buy_total==2}<p style="font-size: .24rem;color: #999999;line-height: .32rem;padding-top: .1rem">已购：{$item['order_total']}</p>{/if}
                {if $item['min_distance']}<p style="font-size: .24rem;color: #999999;line-height: .32rem;padding-top: .1rem">距离：{$item['min_distance']}km</p>{/if}
            </div>
            <a href="javascript:void(0)" class="checkMore" data-k="{php echo $index;}" data-sjid="{$item['sj_id']}"
               style="background: linear-gradient(90deg,{$edu_colors['shop_card_c1']} -6.48%,{$edu_colors['shop_card_c2']} 97.21%)">查看</a>
        </li>
        {/loop}
    </ul>
    {if !$is_end}
    <div class="loadmoren" style="line-height: 30px;text-align: center;margin-bottom: 10px;">点击加载更多...</div>
    {else}
    <div class="mo-more-data" style="line-height: 30px;text-align: center;margin-bottom: 10px;">暂无更多数据</div>
    {/if}
</div>
<!--查看信息弹窗-->
<div class="school_list">

</div>
<div class="h160"></div>
<div class="footer" >
    <a href="/{php echo createMobileUrl('index', array('themeid'=>$themeid));}" class="home">首页</a>
    <a href="javascript:void(0);" class="kf" onclick="showService()">客服</a>
    <div class="footBtn">
        <a href="javascript:history.back(-1)" >
            返回活动页
        </a>
    </div>
</div>
</body>
{include file='../../plugin/education/template/mobile/wxpay'}
<script>
    let show_buy_total = "{$show_buy_total}"
    let acCho_c1 = "{$edu_colors['acCho_c1']}"
    let acCho_c2 = "{$edu_colors['acCho_c2']}"
    var loadingState= false;
    var ISEND= "{$is_end}";
    let page = 1;
    $('#screen').click(function(){
        $('#screen').fadeOut();
        $('.inventAlt').animate({'bottom':'-150%'},500)
        $('.schoolAlt').animate({'bottom':'-110%'},500)
    })
    $('.school_list').on('click','.closeScholl',function(){
        $('#screen').fadeOut();
        $('.schoolAlt').animate({'bottom':'-110%'},500)
    })
    //查看学校信息
    $('#serviceList_ul').on('click','li',function(){
        console.log(4444)
        var key = $(this).data("k");
        var sj_id = $(this).data("sjid");
        console.log(sj_id)
        if (sj_id){
            var lay_index = layer.load(0, {shade: [0.3,'#000']});
            var postUrl = '/{php echo createMobileUrl("wx",array("themeid"=>$themeid,"from"=>"mobile","r"=>"education.index.getShangjiaDetailById"));}'+'&sj_id='+sj_id;
            $.ajax({
                type:'GET',
                dataType:'json',
                url:postUrl,
                success:function (res){
                    var data = res.data;
                    let items = data.items;
                    if (items){
                        $(".school_list").html(items.map((item,index)=>{
                            return `<div class="schoolAlt">
                            <div class="schollTitle" style="background: linear-gradient(90deg,${acCho_c1} -5.72%,${acCho_c2} 85.87%);position: sticky;top: 0;z-index: 1;">
                                ${item.name}
                                <span class="closeScholl"></span>
                            </div>
                            <div class="lessonTop">
                                <div class="lessonBrand">
                                    <img src="${item.logo}">
                                </div>
                                <div class="brandTxt">
                                    <p>${item.kefu.name}</p>
                                    <span>${item.kefu.mobile}</span>
                                </div>
                                <a href="tel:${item.kefu.mobile}" class="brandTel"></a>
                            </div>
                            <div class="lessonBar">
                            ${item.courses.length > 0 ? `<h2>机构课程</h2>
                                <ul>`:''}

                                     ${item.courses.length > 0 ? `${item.courses.map(course => `
                                     <li>
                                        <a href="javascript:void(0)">
                                            <div class="listImg">
                                                <img src="${course.top_img}">
                                            </div>
                                            <div class="listTxt">
                                                <h2>${course.name}</h2>
                                                ${show_buy_total == 2 ? `<p>最新报名<span>${course.selected_num}</span>人</p>` : ''}

                                            </div>
                                        </a>
                                    </li>
                                     `).join('')}` : ''}

                                ${item.courses.length > 0 ? `</ul>`:''}
                                <div class="brandInfor" ${item.courses.length > 0 ? '':`style="border-top:none"`}>
                                    <h2>机构地址</h2>
                                    ${item.address ? `${item.address.map(address => `<p>${address}</p>`).join('')}` : ''}
                                    <h2>机构介绍</h2>
                                    <p>${item.content}</p>
                                </div>
                            </div>
                        </div>`;
                        }));
                        $('#screen').fadeIn();
                        $(".school_list").children().eq(0).animate({'bottom':0},500);
                    }

                    layer.close(lay_index);
                }
            });
        }
    })

    $(".loadmoren").click(function () {
        let get_user_location = "{php echo $user_location;}";
        if (!loadingState && !ISEND){
            var next_page = page+1;
            loadingState = true;
            page = next_page;
            layer.msg('加载中', {
                icon: 16
                ,shade: 0.01
            });
            let new_user_location = GLat+","+GLng;
            let use_user_location = get_user_location?get_user_location:new_user_location;
            let postUrl = '/{php echo createMobileUrl("wx",array("themeid"=>$themeid,"from"=>"mobile","r"=>"education.index.getShangjiaList"));}'+'&user_location='+use_user_location;
            $.ajax({
                url:postUrl,
                dataType:'json',
                method:'post',
                data: {page:next_page},
                success:function (e) {
                    let data = e.data;
                    let error = e.error;
                    let msg = e.msg;
                    if (error!=0){
                        layer.msg(msg);
                    }else{
                        if (data.append_html){
                            $("#serviceList_ul").append(data.append_html);
                        }
                        ISEND = data.is_end
                        if (data.is_end){
                            $(".loadmoren").hide();
                        }
                    }
                    layer.closeAll();
                    loadingState = false;

                },
                fail:function (err) {
                    console.log(err)
                }
            });
        }
    });
    // $(window).scroll(function(){
    //     isEnd = $("#hasNext").val();
    //     var height = $(window).height();
    //     var scrollSpace = $(window).scrollTop();
    //     console.log($(document).height() -  (height*1.2) - 40)
    //     console.log(scrollSpace)
    //     if(scrollSpace>height){
    //         $('.backTop').fadeIn();
    //     }else{
    //         $('.backTop').fadeOut();
    //     }
    //     if (scrollSpace >= $(document).height() -  (height*1.6)){
    //         if (!loadingState && !isEnd){
    //             var next_page = page+1;
    //             loadingState = true;
    //             page = next_page;
    //             layer.msg('加载中', {
    //                 icon: 16
    //                 ,shade: 0.01
    //             });
    //             let new_user_location = GLat+","+GLng;
    //             let postUrl = '/{php echo createMobileUrl("wx",array("themeid"=>$themeid,"from"=>"mobile","r"=>"education.index.getShangjiaList"));}'+'&user_location='+new_user_location;
    //             $.ajax({
    //                 url:postUrl,
    //                 dataType:'json',
    //                 method:'post',
    //                 data: {page:next_page},
    //                 success:function (e) {
    //                     let data = e.data;
    //                     let error = e.error;
    //                     let msg = e.msg;
    //                     if (error!=0){
    //                         layer.msg(msg);
    //                     }else{
    //                         if (data.append_html){
    //                             $("#serviceList_ul").append(data.append_html);
    //                         }
    //                         layer.closeAll();
    //                     }
    //                     loadingState = false;
    //                     hasNext = !data.is_end
    //                     $("#hasNext").val(hasNext);
    //                 },
    //                 fail:function (err) {
    //                     console.log(err)
    //                 }
    //             });
    //         }
    //     }
    // })
</script>
{include file='base/addlog'}
{include file='../../plugin/education/template/mobile/poster'}
</html>